import {
  AppstoreFilled,
  CalendarFilled,
  ClockCircleFilled,
  CloudFilled,
  CloudUploadOutlined,
  OrderedListOutlined,
  ProfileFilled,
  MutedOutlined,
  ProductFilled,
  ProjectFilled,
  SearchOutlined,
  TeamOutlined,
  UsergroupAddOutlined,
  BarChartOutlined,
} from '@ant-design/icons';
import { Badge, Menu } from 'antd';
import { useMemo, useState } from 'react';
import IconFont from '../../components/IconFont';
import { history, useLocation } from '@umijs/max';
import useCurrentUser from '@/utils/useCurrentUser';


const MenuBar = ({ onSearch, onGpt, onTeam, collspan, setCollspan, unreadJoinOrgInvitationCount }) => {
  const [collapsed, setCollapsed] = useState(false);
  const toggleCollapsed = () => {
    setCollapsed(!collapsed);
  };
  const { currentUser } = useCurrentUser();

  const { pathname } = useLocation();

  const items = useMemo(() => {
    const menuser = currentUser?.isCompany === 1 ? {
      key: '/welcome/orgs',
      icon: (
        <UsergroupAddOutlined type="icon-user-fill" style={{ transform: 'scale(1.21)' }} />
      ),
      label: '服务商',
    } : null

    return [
      {
        key: '/welcome/homepage',
        icon: (
          <BarChartOutlined />
        ),
        label: '统计数据',
      },
      menuser,
      {
        key: '/welcome/users',
        icon: (
          <IconFont type="icon-user-fill" style={{ transform: 'scale(1.21)' }} />
        ),
        label: '成员',
      },
      {
        key: '/welcome/projects',
        icon: (
          <IconFont type="icon-ef-renwu-gongju" style={{ transform: 'scale(1.21)' }} />
        ),
        label: '项目',
      },
      {
        key: '/welcome/projecttypes',
        icon: (
          <ProfileFilled style={{ transform: 'scale(1.1)' }} />
        ),
        label: '项目类型',
      },
      {
        key: '/welcome/projectlogs',
        icon: (
          <OrderedListOutlined style={{ transform: 'scale(1.1)' }} />
        ),
        label: '项目日志',
      },
      {
        key: 'team',
        icon: <Badge count={unreadJoinOrgInvitationCount} size="small" offset={[4, 6]} style={{ backgroundColor: "red" }} overflowCount={9}>
          <MutedOutlined style={{ transform: 'scale(1.15)' }} />
        </Badge>,
        label: '发布公告',
      },
      {
        key: 'search',
        icon: <SearchOutlined style={{ transform: 'scale(1.15)' }} />,
        label: '全局搜索',
      },
      {
        key: 'chatgpt',
        icon: (
          <IconFont
            type="icon-a-chatgpt"
            style={{ transform: 'scale(1.15)' }}
          />
        ),
        label: 'chatgpt',
      },
    ]?.filter(it=>it)
  }, [unreadJoinOrgInvitationCount]);

  return (
    <Menu
      selectedKeys={[pathname]}
      theme="light"
      inlineCollapsed={collspan}
      items={items}
      collapsedWidth={60}
      onClick={({ _, key, keyPath, domEvent }) => {
        switch (key) {
          case 'search':
            onSearch?.();
            break;
          case 'chatgpt':
            onGpt?.();
            break;
          case 'team':
            onTeam?.();
            break;
          default:
            history.push(key)
            break;
        }
      }}
    />
  );
};
export default MenuBar;
